<template>
  <view>
    <u-image
      show-loading
      :show-menu-by-longpress="false"
      :src="detail.img"
      width="100%"
      :height="height ? height + 'px' : 'calc(100vh - 88rpx)'"
      @click="preImage"
    />
    <view class="f-row" v-if="type == 'cooperate'">
      <u-text
        :text="`招商热线：${detail.phone}`"
        color="#555"
        size="28rpx"
        @click="callPhone"
      />
      <u-text :text="`发布于 ${detail.date}`" align="right" color="#555" size="28rpx" />
    </view>
  </view>
</template>

<script>
import { qiuIntroduction, qiuOther } from "@/request/qiuApi.js";
export default {
  data() {
    return {
      type: "", // 类型
      height: 0, // 图片高度
      detail: {}, // 信息
    };
  },
  onLoad(e) {
    this.type = e.type;
    if (e.type == "cooperate") {
      uni.setNavigationBarTitle({
        title: "合作招商",
      });
      this.getInvestData();
    } else if (e.type == "guidance") {
      uni.setNavigationBarTitle({
        title: "交通导览",
      });
      this.getMapData();
    }
  },
  methods: {
    // 获取招商图
    getInvestData() {
      qiuIntroduction().then((res) => {
        if (res.code == 1) {
          this.detail = res.data.cooperation;
          this.setHeight();
        }
      });
    },
    // 获取交通导览图
    getMapData() {
      qiuOther().then((res) => {
        if (res.code == 1) {
          let obj = res.data.find((m) => m.type == "jtdl");
          this.detail = obj;
          this.setHeight();
        }
      });
    },
    // 设置图片高度
    setHeight() {
      uni.getImageInfo({
        src: this.detail.img,
        success: (image) => {
          let bl = image.width / image.height; // 图片宽高比
          let wInfo = uni.getWindowInfo();
          this.height = wInfo.screenWidth / bl;
        },
      });
    },
    // 拨打电话
    callPhone() {
      uni.makePhoneCall({
        phoneNumber: this.detail.phone,
      });
    },
    // 预览图片
    preImage() {
      uni.previewImage({
        urls: [this.detail.img],
      });
    },
  },
};
</script>

<style lang="scss" scoped>
.f-row {
  display: flex;
  padding: 20rpx;
}
</style>
